<template>
	<view id="body" :style="{backgroundImage:'url(' + user.img + ')'}">
		<view class="usertop">
		</view>
		<view>
			<view class="userimg">
				<image :src="user.img" class="userimgleft"></image>
			</view>
			<image :src="user.img" class="userimgright"></image>
			<text class="username">{{user.name}}</text>
			<text class="userid">ID:{{user.id}}</text>
			<text class="userstate">+ 状态: {{user.state}}</text>
			<view class="userheart">
				<u-icon :name="heart" color="#eeeeee" size="24px" @click="userlike()"></u-icon>
			</view>
		</view>
		<view class="fillup">
		</view>
		<u-divider text="营销服务"></u-divider> 
		<view>
			<u-grid :border="false" @click="click" col="4">
			    <u-grid-item v-for="(item,index) in marketing":key="index">
			        <text :class="item.title":customStyle="{paddingTop:20+'rpx'}" style="margin-top: 20rpx; width: 64rpx; height: 64rpx;"></text>
			        <text class="grid-text" style="color:#000000;">{{item.name}}</text>
			    </u-grid-item>
			</u-grid>
			<u-toast ref="uToast" />
		</view>
		<u-divider text="其他服务"></u-divider>
		<view>
			<u-grid :border="false" @click="click1" col="4" >
			    <u-grid-item v-for="(item,index) in Other":key="index">
			        <text :class="item.title":customStyle="{paddingTop:20+'rpx'}" style="margin-top: 20rpx; width: 64rpx; height: 64rpx;"></text>
			        <text class="grid-text" style="color:#000000;">{{item.name}}</text>
			    </u-grid-item>
			</u-grid>
			<u-toast ref="uToast" />
		</view>
		<!-- 登录，退出按钮 -->
		<view class="login">
			<u-button  type="primary" :text="loginsign" @click="login"></u-button>
		</view>
	</view>
</template>
	
<script>
	import {socketurl} from "../../static/service/requestAddress/rtas.js"
	const app = getApp()
	export default {
			data() {
				return {
					heart: "heart",
					loginsign:"登录",
					show:false,
					user:{
						id:"000000",
						name:"null",
						img:"http://ft-glb.oss-cn-chengdu.aliyuncs.com/user-img/%E7%94%A8%E6%88%B7.jpg",
						state:"null",
						limit:"0",
						address:"",
					},
					loginuser:{
						name:"",
						password:"",
					},
					marketing:[
						{
							name:"领券服务",
							title:"t-icon t-icon-youhuiquan",
							url:""
						},
						{
							name:"邀请推广",
							title:"t-icon t-icon-yaoqingtuiguang",
							url:""
						},
						{
							name:"提现服务",
							title:"t-icon t-icon-tixian",
							url:"/tixian/index"
						}
					],
					Other: [
						{
							name:"我的收藏",
							title:"t-icon t-icon-shoucang",
							url:""
						},
						{
							name:"我的评价",
							title:"t-icon t-icon-pingjia",
							url:""
						},
						{
							name:"地址管理",
							title:"t-icon t-icon-dizhi",
							url:"/address/address"
						},
						{
							name:"联系客服",
							title:"t-icon t-icon-kefuguanli",
							url:""
						},
						{
							name:"账号设置",
							title:"t-icon t-icon-shezhi",
							url:"/userSet/userSetindex"
						},
						{
							name:"订单中心",
							title:"t-icon t-icon-dingdan1",
							url:"/myorder/order"
						},
						{
							name:"关于我们",
							title:"t-icon t-icon-guanyuwomen",
							url:""
						},
					],
				}
			},
			onShow(){
				var user = uni.getStorageSync('user')
				if(user){
					this.user = JSON.parse(user)
					if(this.user.state == 0){
						this.user.state = "正常"
					}else if(this.user.state == 1){
						this.user.state = "锁定" 
					}
					this.loginsign = "退出登录"
					//设置tabbar
					var num = uni.getStorageSync("tabbar")
						if(num > 0){
							uni.setTabBarBadge({ //显示数字
								index: 1, //tabbar下标
								text:""+num,//数字
								success() {
								console.log("设置成功") 
								},
								fail(e){ 
								   console.log("设置失败"+JSON.stringify(e))
								}
							})
							this.$forceUpdate()
						}
				}
			},
			methods: {
				userlike(){
					if(this.heart == "heart" ){
						this.heart = "heart-fill"
					}else{
						this.heart = "heart"
					}
				},
				click(name){//营销服务  
				console.log("点击的是："+JSON.stringify(this.marketing[name])) 
					if( (this.marketing[name]).name == "领劵服务"){
						uni.$u.toast("管理员暂时关闭了领劵服务")
						return
					}
					if( (this.marketing[name]).name == "邀请推广"){
						uni.$u.toast("管理员暂时关闭了邀请推广功能")
						return
					}
					if( (this.marketing[name]).name == "提现服务"){
						console.log("进入提现服务")
						var path = (this.marketing[name]).url
						uni.navigateTo({
							url:path
						})
					}
				},
				click1(name) {  //其他服务点击事件
				console.log("点击的是："+ JSON.stringify(this.Other[name]))
				var path = (this.Other[name]).url
				uni.navigateTo({
					url:path
				})
				},
				//点击登录验证
				login(){
					if(this.loginsign == "登录"){
						uni.navigateTo({
							url: '/pages/massage/login'
						}) 
					}else{
						var user = {
							id:"000000",
							name:"null",
							img:"http://ft-glb.oss-cn-chengdu.aliyuncs.com/user-img/%E7%94%A8%E6%88%B7.jpg",
							state:"null",
							limit:"0",
							address:"",
						}
						this.user = user
						this.loginsign = "登录"
						//清除所有缓存
						uni.clearStorageSync()
						//关闭websocket
						app.globalData.websocket.closeWebsocket()
						//移除tabbar
						uni.removeTabBarBadge({
							index:1 
						})
						uni.$u.toast("退出登录成功!")
					}
				},
				
			}
		}
</script>

<style>
	@import url("@/static/css/user.css");
	page {
		background-color: #f5f5f5;
	}
</style>